<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>Feed logs view</title>

    <script type="text/javascript" src="/static/js/jquery-1.4.4.min.js"></script>
    <script type="text/javascript" src="/static/js/jquery-ui-1.8.7.custom.min.js"></script>
    <script type="text/javascript" src="/static/js/jquery-ext.js"></script>
    <script type="text/javascript" src="/static/js/logs_checker.js"></script>

    <link type="text/css" href="/static/css/jquery-ui-1.8.7.custom.css" rel="stylesheet"/>
    <link type="text/css" href="/static/css/job_manager.css" rel="stylesheet"/>

    <script type="text/javascript">
        $(document).ready(function() {
            $("#show_log_button").button();

            $("#log_file_select").change(function(e) {
                var selected = $(e.target).find("option:selected");
                if(selected.val() == "fake") {
                    $("#logs_update_control_panel").hide("slow");
                } else {
                    $("#logs_update_control_panel").show("slow");
                }
                var log_file_name = $("#log_file_select option:selected").val();
                $("#current_log_file_name_holder").val(log_file_name);
                $("#start_byte_holder").val(0);

                log_checker.refresh_logs();
            });

            $("#refresh_button").click(function(e) {
                log_checker.refresh_logs();
            });

            $("#auto_refresh_checkbox").click(function(e) {
                var auto_refresh_checkbox = $(e.target);
                if (auto_refresh_checkbox.is(":checked")) {
                    $("#auto_refresh_checkbox_label").css("color", "green");
                    $("#refresh_button").hide("slow");
                    log_checker.refresh_logs_with_interval();
                } else {
                    $("#auto_refresh_checkbox_label").css("color", "#fe5a5a");
                    $("#refresh_button").show("slow");
                    log_checker.clear_interval();
                }
            });

            $(document).ajaxStart(function() {
                $("#ajax_indicator").show();
            }).ajaxStop(function() {
                $("#ajax_indicator").hide();
            });

        })
    </script>
</head>

<body>
<div style="position:absolute; top:0; width:100%; background-color:#e7e6e6; height:5px;border-bottom:1px solid #d3d3d3"></div>

<div id="ajax_indicator" class="ajax_indicator_panel ui-corner-bl ui-corner-br">
    <img src="/static/images/ajax-loader.gif">
</div>

<div class="panel"><h2>Logs for "{{ feed_name }}"</h2></div>

<div style="width:100%; background-color:#e7e6e6; height:5px;border-bottom:1px solid #d3d3d3;border-top:1px solid #d3d3d3"></div>

<div class="panel form_panel ui-corner-all" style="width: 430px;">
    <div>
        <label for="log_file_select" style="font-weight:bold;">Select log file:</label>
        <select id="log_file_select" style="width:250px;">
            <option value="fake">-----</option>
            {% for log_file in log_files %}
                <option value="{{ log_file }}">{{ log_file }}</option>
            {% endfor %}
        </select>
    </div>

    <div id="logs_update_control_panel" style="display:none;">
        <span id="refresh_button" style="cursor:pointer">
            <img src="/static/images/icon_refresh.gif">
        </span>
        <span>
            <input id="auto_refresh_checkbox" type="checkbox"/>
            <label id="auto_refresh_checkbox_label" for="auto_refresh_checkbox" style="color:#fe5a5a">Auto update</label>
        </span>
    </div>

    <input id="feed_id_holder" type="hidden" value="{{ feed_id }}">
    <input id="start_byte_holder" type="hidden" value="0">
    <input id="current_log_file_name_holder" type="hidden">
</div>

<div id="logs_container" class="logs_container ui-corner-all panel">
    <pre></pre>
</div>

</body>
</html>